import React, { Component } from 'react'

let ContextDemo = React.createContext({"name": "jack"});

function Child1() {
	return (
		<div>
			<ContextDemo.Provider value={{"name": "change2"}}>
				<Child2></Child2>
			</ContextDemo.Provider>
		</div>
	)
}

function Child2() {
	return (
		<div>
			<ContextDemo.Consumer>
				{
					value => {
						return (
							<div>
								{value.name}
							</div>
						)
					}
				}
			</ContextDemo.Consumer>
		</div>
	)
}

export default class App extends Component {
	render() {
		return (
			<div>
				<ContextDemo.Provider value={{"name": "change1"}}>
					<Child1></Child1>
				</ContextDemo.Provider>
			</div>
		)
	}
}
